<template>
  <div>
    <el-card>
      <div slot="header">
        <div class="test-deep">
          <el-page-header @back="back">
            <div slot="content" class="HHH">
              <div class="header">
                <span>上架车位</span>
                <el-button type="primary" size="small" @click="add"
                  >添加</el-button
                >
              </div>
            </div>
          </el-page-header>
        </div>
      </div>
      <div>
        <el-table
          :row-class-name="showDoing"
          :data="db_sales"
          style="width: 100%"
        >
          <el-table-column prop="id" label="编号" width="width">
          </el-table-column>
          <el-table-column prop="name" label="名称" width="width">
          </el-table-column>
          <el-table-column prop="saleType" label="类型" width="width">
          </el-table-column>
          <el-table-column prop="final_startDate" label="开始时间" width="width">
          </el-table-column>
          <el-table-column prop="final_endDate" label="结束时间" width="width">
          </el-table-column>
          <el-table-column prop="customType" label="售卖对象" width="width">
          </el-table-column>
          
    
       
        </el-table>
      </div>
    </el-card>

  </div>
</template>

<script>
import {mapState} from 'vuex'
export default {
  computed:{
    ...mapState(['db_sales'])
  },
  methods: {
    add() {
      this.$router.push("sale-add");
    },
    showDetail(index, row) {
      //发出一个请求获取这次批号的销售
      for(let i of this.orderHistory){
        if(i.id==row.id){
          this.currentItem = i.orders
          localStorage.set('currentItem',i.orders)
        }
      }
    },
    showDoing({ row, rowIndex }) {
      let res = "";
      switch (row.state) {
        case "已结束":
          res = "ending";
          break;
        case "进行中":
          res = "doing";
          break;
      }
      return res;
    },
  },
  data() {
    return {
      currentItem:null,
  
      tableData: [
        {
          id: "001",
          explain: "东区热销更新",
          type: "普通销售",
          state: "未开始",
          startDate:"",
          endDate:"",
          customer:'业主',
        },
        {
          id: "002",
          explain: "西区活动更新",
          type: "摇号销售",
          state: "进行中",
          startDate:"",
          endDate:"",
          customer:'业主',
        },
        {
          id: "003",
          explain: "南区活动更新",
          type: "摇号销售",
          state: "已结束",
          startDate:"",
          endDate:"",
          customer:'业主',
        },
      ],
    };
  },
};
</script>

<style scoped>
.el-card {
  margin-top: 2rem;
}
.el-page-header {
  align-items: center;
}
.test-deep >>> .el-page-header__content {
  flex: 1;
  width: 100%;
}
.el-table .ending {
  background-color: rgba(240, 249, 235, 0.5);
}
.el-table .doing {
  background-color: rgba(217, 236, 255, 0.5);
}
.header {
  width: 100%;

  display: flex;
  justify-content: space-between;
}
</style>